<template>

	<view class="">
		<!-- 	<view class="bindMembers flex-column">
			 <image class="img" src="../../static/会员卡后台端/组合 1136.png" mode=""></image>
			 <view style="margin-top: 5rpx;" class="">
			 	请绑定会员信息
			 </view>
		</view> -->
		<block v-if="formContent">
			<view class="alipaysubmit" v-html="formContent"></view>
		</block>
		<view class="">
			<view class="top">

				<view class="active-name margin-bottom_20rpx">支付金额</view>
				<view class="display-a padding-bottom_20rpx p-bo">
					<view class="font-weight_bold font-size_40rpx">￥</view>
					<input type="text" v-model="total" placeholder="请输入付款金额" disabled placeholder-class="p-class"
						class="p-input" />
				</view>
			</view>

			<lzc-keyboard ref="lzckeyboard" :defaultValue='total' :defaultType='set.payType' @change="change"
				@confirms="confirms"></lzc-keyboard>
		</view>
	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			return {
				total: '',
				set: {
					payType: '2'
				},
				store_id: '',
				code: '',
				appid: '',
				formContent: ''
			}
		},
		onLoad(options) {
		
			if (!(options.path == 'pages/storePaymentCode/paymentCodePayPage')) {
				this.store_id = options.store_id

				let ua = window.navigator.userAgent.toLowerCase();
				//判断是不是微信
				if (ua.match(/MicroMessenger/i) == "micromessenger") {
					// 微信
					this.set.payType = 1
					this.init()
				
				}
				//判断是不是支付宝
				if (ua.match(/AlipayClient/i) == "alipayclient") {
					//支付宝
					this.set.payType = 2
				}
			}

		},
		onShow() {
			this.$at.releaseKey('submitAll');
		},
		methods: {
			async init() {
				const res = await this.$http.post({
					url: this.$api.getConfig,
					data: {

					},

				})
				console.log(res)
				if (res.code == 0) {
					if(res.data.appid){
						this.appid = res.data.appid
						console.log(this.appid)
						this.getCode();
					}else{
						this.$sun.toast('请配置appid')
					}
				}else{
					this.$sun.toast('请配置appid')
				}
			},
			// 强制关注公众号，获取openid
			getCode() {
				// if (sessionStorage.getItem("openid") && sessionStorage.getItem("openid") != "undefined") {
				// 	return false;
				// }
				this.code = this.getUrlParam('code') // 截取路径中的code，如果没有就去微信授权，如果已经获取到了就直接传code给后台获取openId
				var local = window.location.href;
				var APPID = this.appid;
				if (this.code == null || this.code === '') {
					window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + APPID +
						'&redirect_uri=' + encodeURIComponent(local) +
						'&response_type=code&scope=snsapi_base&state=#wechat_redirect'
				} else {
					this.getOpenId(this.code) //把code传给后台获取用户信息
				}
			},
			//把code传给后台,得到openid
			getOpenId(code) {
				this.$sun.toast(code, 'none')
				
				// 本地存储这个openid，并刷新页面
				// sessionStorage.setItem("openid", res.data.openid);
			},
			//获取地址栏的参数
			getUrlParam(name) {
				var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
				var r = window.location.search.substr(1).match(reg);
				if (r != null) return unescape(r[2]);
				return null;
			},
			//页面执行调用





			change(e) {
				this.total = e;
			},


			async confirms(payType) {
				console.log(payType)
				this.$at.uniDoFunc({
					key: 'submitAll',
					success: async () => {
						this.$at.lockKey('submitAll');


						if (this.total) {
							this.$sun.toast(JSON.stringify({
								amount: 1,
								pay_type: payType == 1 ? 9 : 10,
								store_id: 1,
								open_id: this.code

							}), 'none')
							// 查询分类列表
							const result = await this.$http.post({
								url: this.$api.polymerizationPay,
								data: {
									amount: this.total,
									pay_type: payType == 1 ? 9 : 10,
									store_id: this.store_id,
									code: this.code
								},
								headers: {
									'Authorization': `Bearer ${this.token}`
								}

							})
							if (result.code == 0) {
								// console.log(result.data)
								// this.$sun.toast(JSON.stringify(result.data), 'none')
								if (payType == 1) {

									let pay = result.data
									this.$at.releaseKey('submitAll');
									await this.$wx.config({
										debug: false,
										appId: pay.appid,
										timestamp: pay.timeStamp,
										nonceStr: pay.nonceStr,
										paySign: pay.paySign,
										jsApiList: ['chooseWXPay']
									});
									await this.$wx.chooseWXPay({
										timestamp: pay.timeStamp,
										nonceStr: pay.nonceStr,
										package: pay.package,
										signType: pay.signType,
										paySign: pay.paySign,
										appId: pay.appId,

										success: async res => {
											this.isSuccess = true;
											this.$sun.toast('进入支付成功111');
											console.log('进入支付成功2222222', res);

											// 后台修改状态，则不需要重复调用接口
											// this.wxOrder();
										},
										fail: async err => {
											this.$sun.toast('取消了支付');
											this.$at.releaseKey('submitAll');


										},
										complete: async res => {
											if (this.isSuccess == true) {

												console.log('进入支付成功回调===========', res);

											} else {
												this.$sun.toast('取消了支付');
												this.$at.releaseKey('submitAll');

											}
											// this.$sun.navRe('/pages/storePaymentCode/paymentCodePayPage',{store_id:this.store_id})
										window.location.href=window.location?.origin+'/H5/gongzhManagement.html#/pages/storePaymentCode/paymentCodePayPage?store_id=' + this.store_id
											// window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + this.appid +
											// 	'&redirect_uri=' + encodeURIComponent(window.location.href) +
											// 	'&response_type=code&scope=snsapi_base&state=#wechat_redirect'
											// this.getCode()
											console.log('进入测试回调===========', res);
										}
									});
								} else {
									this.$at.releaseKey('submitAll');
									this.formContent = result.data; // 记得data中声明该变量
									this.$nextTick(() => {
										//这里就是提交表单唤起支付宝，中括号中的name名称，要与后端给的form表单name名称一致，
										document.forms['alipaysubmit'].submit();
									});
								}

							} else {
								this.$at.releaseKey('submitAll');
								this.$sun.toast(result.msg, 'none')
							}
						} else {
							this.$at.releaseKey('submitAll');
							this.$sun.toast('请填写金额', 'none')
						}
					}
				})

			}
		}
	}
</script>

<style lang="less" scoped>
	.bindMembers {
		background-color: rgb(244, 244, 244);
		;
		padding: 40rpx;

		.img {
			width: 112.26rpx;
			height: 112.26rpx;
		}
	}

	.top {
		width: 750rpx;
		height: 100%;
		background-color: #FFFFFF;
		border-radius: 20rpx 20rpx 0 0;
		padding: 40rpx 26rpx 60rpx;

		position: absolute;
		z-index: 9;
	}

	.p-input {
		color: #000000;
		font-size: 44rpx;
		margin-left: 20rpx;
		width: 600rpx;
	}

	.p-class {
		color: #999999;
		font-size: 44rpx;
	}

	.active-name {
		font-size: 26rpx;
		color: #666666;
	}
</style>